<%@ page contentType="text/html;charset=UTF-8" %>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  <meta name="layout" content="main"/>
  <script type="text/javascript" src="${createLinkTo(dir: 'js/jquery', file: 'jquery-1.3.2.min.js')}"></script>
  <script type="text/javascript" src="${createLinkTo(dir: 'js/jquery', file: 'jquery.FCKEditor.js')}"></script>
  <link rel="stylesheet" href="${createLinkTo(dir: 'css', file: 'popupList.css')}"/>
  <g:javascript>
    $(document).ready(function() {
        $('#content').fck({path: '/yuying/fckeditor/',  toolbar:'Default', height:450, width:500 });
        $('.edit').click(function() {
          var id = $(this).attr("id")
          var stagePos = $(this).position();
          var stageTopOffset = -200;
          var stageLeftOffset = -600;
          $("#editPage").css("top", stagePos.top + stageTopOffset);
          $("#editPage").css("left", stagePos.left + stageLeftOffset);
          $("#editPage").css("width", 500);
          display(id);
        });
          $("#update").click(function(){
              var seq = $(this).attr("seq");
              updatecontent(seq);
          }) ;
    });
//    $(function() {
//        $('#content').fck({path: '/yuying/fckeditor/',  toolbar:'Default', height:450, width:500 });
//    });
   function updatecontent(id) {
            alert($("#fckeditor").val());
            %{--$.post("${createLink(controller: 'entry', action: 'updatecontent')}",{id:id,myContent:$("#fckeditor").text()}, function(data) {--}%
  %{--if(data == "success"){--}%
  %{--alert("success");--}%
  %{--} else {--}%
  %{--alert(data);--}%
  %{--}--}%
  %{--});--}%
    $("#editPage").hide("slow");
  };

function display(id) {
    $.get("${createLink(controller: 'entry', action: 'getcontent')}",{id:id}, function(data) {
              alert("1:::"+$("#fckeditor").val())
              var text = data
              $("#fckeditor").val(text);
               alert("2:::"+$("#fckeditor").val())
              $("#editPage").show("slow");
              $("#update").attr("seq",id);
            });
          };
  </g:javascript>
  <title>文章编辑</title>
</head>
<body>
<div class="nav">
  <span class="menuButton"><a class="home" href="${createLinkTo(dir: '')}">Home</a></span>
  <span class="menuButton"><g:link class="create" action="create">New Entry</g:link></span>
  <span class="menuButton"><g:link class="list" action="ajaxlist">My List</g:link></span>
</div>
<div class="body">
  <g:if test="${flash.message}">
    <div class="message">${flash.message}</div>
  </g:if>
  <div id="editPage" class="popupList hidden">
    <div class="content"><textarea id="fckeditor" class="fck"></textarea></div>
    <div class="footer">&nbsp;&nbsp;<input type="button" value="取消" class="btnGrey" style="padding:3px 5px;margin:3px 0 8px 0" onClick="$('#editPage').hide('slow')">
      &nbsp;&nbsp;<input id="update" type="button" value="更新" class="btnGrey" style="padding:3px 5px;margin:3px 0 8px 0">
    </div>
  </div>
  <div class="list">
    <g:each in="${entryInstanceList}" status="i" var="entry">
      <div class="enrty">
        <h1 class="title">${entry.title}</h1>
        <div id="content${entry.id}" class="src" content="${entry.content}">${entry.content}</div>
        <p align="right"><a onClick="ajaxdelete('${entry.id}')">删除</a>&nbsp;&nbsp;<a class="edit" id="${entry.id}">编辑</a></p>
      </div>
    </g:each>
  </div>
  <div class="paginateButtons">
    <g:paginate total="${entryInstanceTotal}"/>
  </div>
</div>
</body>
</html>
  